<template>
    <div class="layui-fluid">
        <div class="layui-row">
            <form v-model="singleClient">
                <input type="text" style="display: none" v-model="singleClient.id">
                <div class="layui-form-item">
                <label class="layui-form-label" style="width:140px">
                    <span class="x-red">*</span>客户名称</label>
                <div class="layui-input-inline">
                    <input type="text" required="" class="layui-input" v-model="singleClient.client">
                </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>客户类型</label>
                    <div class="layui-input-inline">
                        <select required="" class="layui-input" v-model="singleClient.type">
                            <option :value="type" v-for="type in typeList" >{{type}}</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>联络人</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.name">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>电话</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.phone">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>联络人2</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.name2">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>电话2</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.phone2">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>来源</label>
                    <div class="layui-input-inline">
                        <select required="" class="layui-input" v-model="singleClient.source">
                            <option :value="a" v-for="a in sourceList" >{{a}}</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>客户级别</label>
                    <div class="layui-input-inline">
                        <select required="" class="layui-input" v-model="singleClient.clientLevel">
                            <option :value="level" v-for="level in clientLevel" >{{level}}</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>客户需求</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.clientRequests">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>克重规格及用量</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.requestsDetail">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>寄件地址</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.mailAddress">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>开票资料</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.invoiceTitle">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>固话</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.phoneGuhua">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>传真</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.fax">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>邮件</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.email">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>负责人</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.client_eid">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>备注</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.remarks">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>最后一次成交时间</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.lastDealTimeText">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>预计回收时间</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.assumeRecycleTimeText">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>领取/分配时间</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.getDispatchTimeText">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>负责人变更时间</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.ownerChangeTimeText">
                    </div>
                </div>
                <div >
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>退回/收回时间</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.recycleTimeText">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>地址</label>
                    <div class="layui-input-inline">
                        <myCityPicker :province="select.province" :city="select.city" :area="select.area"></myCityPicker>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>详细地址</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.address">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>最后跟进时间</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.lastProcessTimeText">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>成交状态</label>
                    <div class="layui-input-inline">
                        <select required="" class="layui-input" v-model="singleClient.dealStatus">
                            <option :value="status" v-for="status in dealStatus" >{{status}}</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>剩余保有时间</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.remainKeepTime">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>退回/收回原因</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.rejectReason">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>转手次数</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.passShiftTime">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>创建人</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.creater">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>创建时间</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.createTimeText">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>最后修改人</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.lastModifier">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:140px">
                        <span class="x-red">*</span>最后修改时间</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" v-model="singleClient.lastModifyTimeText">
                    </div>
                </div>
                <div style="text-align: center">
                    <button class="layui-btn" @click="submitForm(singleClient)">提交</button>
                </div>
            </form>
        </div>
    </div>
</template>

<script>
    import { mapActions, mapState } from "vuex";
    import service from "../../../src/service";
    import CityPicker from "v-distpicker";

    export default {
        data(){
            return{
                typeList:["终端","经销"],
                clientLevel:["A","B","C","D","E"],
                dealStatus:["未成交","已成交"],
                sourceList:["其他",
                    "客户介绍",
                    "客户来电",
                    "线索池",
                    "公司分配",
                    "400电话",
                    "出差拜访",
                    "微信/QQ",
                    "搜索引擎",
                    "阿里巴巴",
                    "话务员转移"],
                select: { province: this.singleClient.province, city: this.singleClient.city, area: this.singleClient.district },
            }
        },
        components:{
            'myCityPicker':CityPicker
        },
        props:['singleClient'],
        name: "member-edit",
        methods:{
            submitForm(data){
                var client = {
                    "id":data.id,
                    "name":data.name,
                    "phone":data.phone,
                    "client":data.client,
                    "district":data.province+data.city+data.district
                }
                service.instance().put("http://"+window.location.hostname+":8011/Client",client)
                    .then((response)=> {
                        if(response.data == "1"){
                            this.getClients();
                            this.$layer.alert("修改成功");
                            parent.closeAll()
                        }
                    })
            },
            ...mapActions(["getClients"])
        },
        computed:{

        },
        mounted() {

        }
    }
</script>

<style scoped>

</style>
